<template>
  <t-dialog :header="header" :visible.sync="visible" :onClose="closeDialog" :closeOnOverlayClick="false"
    @confirm="onSubmit" :confirmBtn="{
      content: loading ? '提交中...' : '确认',
      theme: 'primary',
      loading: loading,
    }" width="90%" top="5%">
    <div style="height: 65vh">
      <t-form ref="form" :colon="true" :data="formData" labelWidth="170px" :rules="rules">
        <t-form-item v-if="site_tag === 'jtt'" label="上级" name="parentId">
          <t-tree-select clearable :treeProps="{ keys: { value: 'id', label: 'name' } }" v-model="formData.parentId"
            :data="menuOptions" placeholder="选择上级不选为最上级"></t-tree-select>
        </t-form-item>
        <t-form-item label="类别名称" name="name">
          <t-input clearable v-model="formData.name" :min="0" placeholder="请输入"></t-input>
        </t-form-item>
        <t-form-item label="类型" name="categoryType">
          <t-radio-group v-model="formData.categoryType" :options="categoryTypeOptions"></t-radio-group>
        </t-form-item>
        <t-form-item layout="inline">
          <t-form-item v-if="formData.categoryType === '1'" label="申报开始时间" name="startDate">
            <t-date-picker clearable v-model="formData.startDate" placeholder="申报开始时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="申报截止时间" name="endDate">
            <t-date-picker clearable v-model="formData.endDate" placeholder="申报截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="申报单位审批截止时间" name="declareEndDate">
            <t-date-picker clearable v-model="formData.declareEndDate" placeholder="申报单位审批截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="归口单位推荐截止时间" name="manageEndDate">
            <t-date-picker clearable v-model="formData.manageEndDate" placeholder="归口单位推荐截止时间" />
          </t-form-item>
        </t-form-item>
        <!-- <t-form-item layout="inline">
          <t-form-item  label="申报审批开始时间" name="sbStartDate">
            <t-date-picker clearable v-model="formData.spStartDate" placeholder="申报审批开始时间"/>
          </t-form-item>
          <t-form-item  label="申报审批截止时间" name="spEndDate">
            <t-date-picker clearable v-model="formData.spEndDate" placeholder="申报审批截止时间"/>
          </t-form-item>
        </t-form-item> -->
        <t-form-item layout="inline">
          <t-form-item v-if="formData.categoryType === '1'" label="大纲开始时间" name="dgStartDate">
            <t-date-picker clearable v-model="formData.dgStartDate" placeholder="大纲开始时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="大纲截止时间" name="dgEndDate">
            <t-date-picker clearable v-model="formData.dgEndDate" placeholder="大纲截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="申报单位审批截止时间" name="declareDgEndDate">
            <t-date-picker clearable v-model="formData.declareDgEndDate" placeholder="申报单位审批截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="归口单位推荐截止时间" name="manageDgEndDate">
            <t-date-picker clearable v-model="formData.manageDgEndDate" placeholder="归口单位推荐截止时间" />
          </t-form-item>
        </t-form-item>
        <t-form-item layout="inline">
          <t-form-item v-if="formData.categoryType === '1'" label="任务书开始时间" name="rwsStartDate">
            <t-date-picker clearable v-model="formData.rwsStartDate" placeholder="任务书开始时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="任务书截止时间" name="rwsEndDate">
            <t-date-picker clearable v-model="formData.rwsEndDate" placeholder="任务书截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="申报单位审批截止时间" name="declareRwsEndDate">
            <t-date-picker clearable v-model="formData.declareRwsEndDate" placeholder="申报单位审批截止时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="归口单位推荐截止时间" name="manageRwsEndDate">
            <t-date-picker clearable v-model="formData.manageRwsEndDate" placeholder="归口单位推荐截止时间" />
          </t-form-item>
        </t-form-item>
        <t-form-item layout="inline">
          <t-form-item v-if="formData.categoryType === '1'" label="验收开始时间" name="ysStartDate">
            <t-date-picker clearable v-model="formData.ysStartDate" placeholder="验收开始时间" />
          </t-form-item>
          <t-form-item v-if="formData.categoryType === '1'" label="验收截止时间" name="ysEndDate">
            <t-date-picker clearable v-model="formData.ysEndDate" placeholder="验收截止时间" />
          </t-form-item>
        </t-form-item>

        <t-form-item label="序号" name="sort">
          <t-input-number clearable v-model="formData.sort" :min="0" placeholder="请输入"></t-input-number>
        </t-form-item>
        <t-form-item label="是否启用" name="sort">
          <t-radio-group v-model="formData.enable">
            <t-radio value="1"> 启用</t-radio>
            <t-radio value="2"> 停用</t-radio>
          </t-radio-group>
        </t-form-item>
        <t-form-item label="描述" name="note">
          <t-textarea clearable :autosize="{ minRows: 5 }" v-model="formData.note" placeholder="请输入内容" />
        </t-form-item>
      </t-form>
    </div>
  </t-dialog>
</template>

<script>

export default {
  name: "add-edit-plan-category",
  dicts: ["category_type"],
  components: {},
  props: ["header", "objId", "parentId"],
  data () {
    return {
      visible: true,
      loading: false,
      menuOptions: [],
      formData: {
        parentId: null,
        name: "",
        sort: 0,
        dateRange: [],
        categoryType: '1',
        note: '',
        startDate: '',
        site_tag: import.meta.env.VITE_SITE_TAG,
        endDate: '',
        spStartDate: '',
        spEndDate: '',
        dgStartDate: '',
        dgEndDate: '',
        rwsStartDate: '',
        rwsEndDate: '',
        manageEndDate: '',
        manageDgEndDate: '',
        manageRwsEndDate: '',
        declareEndDate: '',
        declareDgEndDate: '',
        declareRwsEndDate: '',
        ysStartDate: '',
        ysEndDate: '',
        enable: '1'
      },
      categoryTypeOptions: [
        { label: "计划", value: "1" }, { label: "方向", value: "3" }
      ],
      rules: {
        dateRange: [{ required: true, validator: (val) => val && val.length, message: "申报时间不能为空", type: "error" },
          // {validator: (val) => new Date(val[0])< new Date(val[1]),message: "开始时间不能大于截止时间", type: "error"}
        ],
        endDate: [
          {
            validator: (val) => {
              if (val && this.formData.startDate) {
                const startTime = new Date(this.formData.startDate).getTime()
                const endTime = new Date(val).getTime()
                return startTime <= endTime;
              }
              return true;
            }, message: "申报开始时间不能大于申报截止时间", type: "error"
          },
        ],
        dgEndDate: [
          {
            validator: (val) => {
              if (val && this.formData.dgStartDate) {
                const startTime = new Date(this.formData.dgStartDate).getTime()
                const endTime = new Date(val).getTime()
                return startTime <= endTime;
              }
              return true;
            }, message: "大纲开始时间不能大于大纲截止时间", type: "error"
          },
        ],
        rwsEndDate: [
          {
            validator: (val) => {
              if (val && this.formData.rwsStartDate) {
                const startTime = new Date(this.formData.rwsStartDate).getTime()
                const endTime = new Date(val).getTime()
                return startTime <= endTime;
              }
              return true;
            }, message: "任务书开始时间不能大于任务书截止时间", type: "error"
          },
        ],
        ysEndDate: [
          {
            validator: (val) => {
              if (val && this.formData.ysStartDate) {
                const startTime = new Date(this.formData.ysStartDate).getTime()
                const endTime = new Date(val).getTime()
                return startTime <= endTime;
              }
              return true;
            }, message: "验收开始时间不能大于验收截止时间", type: "error"
          },
        ],
        name: [{ required: true, message: "类别名称不能为空" }],
        categoryType: [{
          validator: (val) => {
            if (val === '1') {
              return true
            }
            return this.formData.parentId > 0;
          }, message: "上级不能为空", type: "error"
        }]
      }
    }
  },
  watch: {
    objId: {
      immediate: true,
      handler (val) {
        if (val) {
          this.getObj();
        }
      }
    },
    parentId: {
      immediate: true,
      handler (val) {
        if (val) {
          this.formData.parentId = val;
        }
      }
    }
  },
  mounted () {
    if (this.objId === 0) {
      this.getTree();
    }
  },
  methods: {
    getObj () {
      this.$api.kjxm.project.planCategoryList(this.queryParams).then(
        (res) => {
          this.menuOptions = this.handleTree(res.data, "id");
          this.$api.kjxm.project.planCategoryGet(this.objId).then((response) => {
            if (response.data.startDate === null) {
              response.data.startDate = ''
            }
            if (response.data.endDate === null) {
              response.data.endDate = ''
            }
            // if (response.data.startDate === null) {
            //   this.formData.dateRange = [];
            // } else {
            //   this.formData.dateRange = [response.data.startDate, response.data.endDate];
            // }
            Object.assign(this.formData, response.data);
          });
        }).catch((e) => {
          this.$message.error(e.toString());
        });
    },
    onSubmit () {
      this.$refs.form.validate().then((validateResult) => {
        if (validateResult === true) {
          this.loading = true;
          if (this.objId !== 0) {
            let { parentId } = this.formData;
            if (this.deptId === this.formData.parentId) {
              parentId = 0;
            }
            const row = { ...this.formData, parentId }
            // [this.formData.startDate, this.formData.endDate] = this.formData.dateRange;
            this.$api.kjxm.project.planCategoryEdit(this.formData).then((response) => {
              this.$message.success("修改成功");
              this.$emit("reload");
              // this.$emit("reload");
              this.$emit("update:visible", false);
              this.loading = false;
            }).catch((e) => {
              this.loading = false;
              this.$message.error(e.toString());
            });
          } else {
            let { parentId } = this.formData;
            if (!this.formData.parentId) {
              parentId = 0;
            }
            const row = { ...this.formData, parentId }
            // [this.formData.startDate, this.formData.endDate] = this.formData.dateRange;
            this.$api.kjxm.project.planCategoryAdd(this.formData).then((response) => {
              this.$message.success("新增成功");
              this.$emit("reload");
              // this.$emit("reload");
              this.$emit("update:visible", false);
              this.loading = false;
            }).catch((e) => {
              this.loading = false;
              this.$message.error(e.toString());
            });
          }
        }
      });
    },
    closeDialog () {
      this.$emit("update:visible", false);
    },
    getTree () {
      this.$api.kjxm.project.planCategoryList(this.queryParams).then(
        (res) => {
          this.menuOptions = this.handleTree(res.data, "id");
        }).catch((e) => {
          this.$message.error(e.toString());
        });
    }
  }
}
</script>

<style scoped></style>
